<template>
  <div class="edit-other-content">
    <el-form label-position="top" :model="form" :rules="rules" ref="form">
      <el-row>
        <el-col :span="24">
          <el-form-item label="附加信息" prop="other">
            <el-input
                v-model="form.other"
                type="textarea"
                :autosize="{ minRows: 4, maxRows: 8}"
                maxlength="500"
                :placeholder="'如获奖经历和重要证书，最少输入10个字'">
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<script>
import {getAddition, submitAddition} from "@/api/mineCenter";

export default {
  name: "Other",
  emits: ['refresh'],
  data() {
    return {
      formLoading:false,
      form: {
        other: ''
      },
      rules: {
        other: [
          {required: true, message: '请输入内容', trigger: 'blur'},
        ]
      }
    }
  },
  methods: {
    submit() {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          if(this.formLoading){
            this.$message.warning('请等待加载完成');
            return;
          }
          const loading=this.$loading({text:'提交中'});
          submitAddition(this.form).then(()=>{
            this.$message.success('保存成功');
            this.$emit('refresh',6)
          }).finally(()=>{
            loading.close()
          })
        }
      });
    },
    getDetail(){
      this.formLoading=true
      getAddition({}).then((res)=>{
        this.form.other=res?.data ?? '';
      }).finally(()=>{
        this.formLoading=false
      }).catch(()=>{
        this.$emit('refresh',6)
      })
    }
  },
  mounted() {

  }
}
</script>

<style lang="scss" scoped>
.edit-other-content {
  padding: 0 60px;

  .el-date-editor, .el-select {
    width: 100%;
  }
}
</style>
